<!--Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE HTML>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Mr Hotel a Hotel Category Flat Bootstrap Responsive Website Template | Services :: w3layouts</title>
    <link href="http://localhost:8080/hotle/css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="../static/hotle/js/jquery-1.11.0.min.js"></script>
    <!-- Custom Theme files -->
    <link href="http://localhost:8080/hotle/css/style.css" rel="stylesheet" type="text/css" media="all"/>
    <link href="http://localhost:8080/hotle/css/style1.css" rel="stylesheet" type="text/css" media="all"/>
    <!-- Custom Theme files -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="keywords" content="Mr Hotel Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design"/>
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
    <!--Google Fonts-->
    <link href='//fonts.googleapis.com/css?family=Hind:400,300' rel='stylesheet' type='text/css'>
    <link href='//fonts.googleapis.com/css?family=Aladin' rel='stylesheet' type='text/css'>
    <!--google fonts-->
    <!-- animated-css -->
    <link href="http://localhost:8080/hotle/css/animate.css" rel="stylesheet" type="text/css" media="all">
    <script src="http://localhost:8080/hotle/js/wow.min.js"></script>
    <script>
        new WOW().init();
    </script>
    <!-- animated-css -->
    <script src="http://localhost:8080/hotle/js/bootstrap.min.js"></script>
</head>
<body>
<!--header-top start here-->
<div class="top-header">
    <div class="container">
        <div class="top-header-main">
            <div class="col-md-4 top-social wow bounceInLeft" data-wow-delay="0.3s">
                <ul>
                    <li><h5>Follow Us :</h5></li>
                    <li><a href="#"><span class="fb"> </span></a></li>
                    <li><a href="#"><span class="tw"> </span></a></li>
                    <li><a href="#"><span class="in"> </span></a></li>
                    <li><a href="#"><span class="gmail"> </span></a></li>
                </ul>
            </div>
            <div class="col-md-8 header-address wow bounceInRight" data-wow-delay="0.3s">
                <ul>
                    <li><span class="phone"> </span> <h6>(220) 280-31589</h6></li>
                    <li><span class="email"> </span><h6><a href="mailto:info@example.com">Youremail@gmail.com</a></h6>
                    </li>
                </ul>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
<!--header-top end here-->
<!--header start here-->
<!-- NAVBAR
    ================================================== -->
<div class="header">
    <div class="fixed-header">

        <div class="navbar-wrapper">
            <div class="container">
                <nav class="navbar navbar-inverse navbar-static-top">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                                data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <div class="logo wow slideInLeft" data-wow-delay="0.3s">
                            <a class="navbar-brand" href="HotleMain.html"><img
                                    src="http://localhost:8080/hotle/images/logo.png"/></a>
                        </div>
                    </div>
                    <div id="navbar" class="navbar-collapse collapse">
                        <nav class="cl-effect-16" id="cl-effect-16">
                            <ul class="nav navbar-nav">
                                <li><a href="HotleMain.html" data-hover="首页">首页</a></li>
                                <li><a th:href="@{/users/findHotleToReception}" data-hover="酒店预订">酒店预订</a></li>
                                <li><a class="active" href="HotleSelected.html" data-hover="精选酒店">精选酒店</a></li>
                                <li><a href="room.html" data-hover="Rooms">Rooms</a></li>
                                <li><a th:href="@{/users/findOrderByUser}" data-hover="我的订单">我的订单</a></li>
                                <li><a th:href="@{/users/UserCount}" data-hover="帐号管理">帐号管理</a></li>
                            </ul>
                        </nav>

                    </div>
                    <div class="clearfix"></div>
                </nav>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
<!--header end here-->
<!--services strat here-->
<div class="services">
    <div class="container">
        <div class="services-man">
            <div class="services-top">
                <h1>Services</h1>
            </div>
            <div class="services-bottom wow slideInLeft" data-wow-delay="0.3s">
                <div class="col-md-4 services-grid">
                    <div class="item item-type-move">
                        <a class="item-hover" href="single.html">
                            <div class="item-info">
                                <div class="headline">
                                    Our Rooms
                                    <div class="line"></div>
                                </div>
                                <div class="date">February 29, 2016</div>
                            </div>
                            <div class="mask"></div>
                        </a>
                        <div class="item-img">
                            <img src="images/s1.jpg" class="img-responsive" alt="">
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="ser-text">
                        <h4>On the other hand</h4>
                        <p>On the other hand, we denounce with righteous indignation and dislike men</p>
                    </div>
                </div>
                <div class="col-md-4 services-grid">
                    <div class="item item-type-move">
                        <a class="item-hover" href="single.html">
                            <div class="item-info">
                                <div class="headline">
                                    Our Rooms
                                    <div class="line"></div>
                                </div>
                                <div class="date">February 29, 2016</div>
                            </div>
                            <div class="mask"></div>
                        </a>
                        <div class="item-img">
                            <img src="images/s2.jpg" class="img-responsive" alt="">
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="ser-text">
                        <h4>Sed perspiciatis</h4>
                        <p>On the other hand, we denounce with righteous indignation and dislike men</p>
                    </div>
                </div>
                <div class="col-md-4 services-grid">
                    <div class="item item-type-move">
                        <a class="item-hover" href="single.html">
                            <div class="item-info">
                                <div class="headline">
                                    Our Rooms
                                    <div class="line"></div>
                                </div>
                                <div class="date">February 29, 2016</div>
                            </div>
                            <div class="mask"></div>
                        </a>
                        <div class="item-img">
                            <img src="images/s3.jpg" class="img-responsive" alt="">
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="ser-text">
                        <h4>On the other hand</h4>
                        <p>On the other hand, we denounce with righteous indignation and dislike men</p>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
</div>
<!--services end here-->
<!--services strip start here-->
<div class="ser-strip">
    <div class="container">
        <div class="ser-strip-main wow rollIn" data-wow-delay="0.3s">
            <h2>Nemo enim ipsam</h2>
            <p>Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid
                ex ea commodi consequatur.</p>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
<!--services strip end here-->
<!--features strat here-->
<div class="features">
    <div class="container">
        <div class="features-main">
            <div class="features-top wow slideInLeft" data-wow-delay="0.3s">
                <h3>Our Features</h3>
                <h4>Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et
                    voluptates repudiandae sint et molestiae non recusandae</h4>
            </div>
            <div class="features-bottom wow slideInRight" data-wow-delay="0.3s">
                <div class="col-md-3 featur-grid">
                    <h4>Temporibus autem quibusdam</h4>
                    <ul>
                        <li><a href="#">Temporibus autem quibusdam</a></li>
                        <li><a href="#">But I must explain office you</a></li>
                        <li><a href="#">denouncing pleasure praising</a></li>
                        <li><a href="#">The other denounce with right</a></li>
                    </ul>
                </div>
                <div class="col-md-3 featur-grid">
                    <h4>Sed ut perspiciatis unde</h4>
                    <ul>
                        <li><a href="#">But I must explain office you</a></li>
                        <li><a href="#">Temporibus autem quibusdam</a></li>
                        <li><a href="#">The other denounce with right</a></li>
                        <li><a href="#">denouncing pleasure praising</a></li>
                    </ul>
                </div>
                <div class="col-md-3 featur-grid">
                    <h4>Nemo enim ipsam voluptatem</h4>
                    <ul>
                        <li><a href="#">denouncing pleasure praising</a></li>
                        <li><a href="#">The other denounce with right</a></li>
                        <li><a href="#">Temporibus autem quibusdam</a></li>
                        <li><a href="#">But I must explain to you</a></li>
                    </ul>
                </div>
                <div class="col-md-3 featur-grid">
                    <h4>Temporibus autem quibusdam</h4>
                    <ul>
                        <li><a href="#">The other denounce with right</a></li>
                        <li><a href="#">denouncing pleasure praising</a></li>
                        <li><a href="#">But I must explain office you</a></li>
                        <li><a href="#">Temporibus autem quibusdam</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<!--features end here-->
<!--footer start here-->
<div class="footer">
    <div class="container">
        <div class="footer-main">
            <div class="col-md-3 ftr-grid wow zoomIn" data-wow-delay="0.3s">
                <div class="ftr-logo">
                    <img src="images/ftr-logo.png" alt="">
                </div>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</p>
                <a href="single.html" class="ftr-btn">Read More</a>
            </div>
            <div class="col-md-3 ftr-grid ftr-mid wow zoomIn" data-wow-delay="0.3s">
                <h3>Address</h3>
                <span class="ftr-line flm"> </span>
                <p>Eye Associates Of Virginia?</p>
                <p>5875 Bremo Road </p>
                <p>Richmond, VA(Virginia) 23226 </p>
                <p>(804) 287-4216 </p>
                <p>Alice Merriman</p>

            </div>
            <div class="col-md-3 ftr-grid ftr-rit wow zoomIn" data-wow-delay="0.3s">
                <h3>Contact Us</h3>
                <form>
                    <input type="text" value="Email" onfocus="this.value = '';"
                           onblur="if (this.value == '') {this.value = 'Email';}">
                    <input type="submit" value="Send"/>
                </form>
                <ul class="ftr-icons">
                    <li><a href="#"><span class="fa"> </span></a></li>
                    <li><a href="#"><span class="tw"> </span></a></li>
                    <li><a href="#"><span class="link"> </span></a></li>
                    <li><a href="#"><span class="gmail"> </span></a></li>
                </ul>
            </div>
            <div class="col-md-3 ftr-grid ftr-last-gd ftr-rit wow zoomIn" data-wow-delay="0.3s">
                <h3>Quick Link</h3>
                <ul class="ftr-nav">
                    <li><a href="index.html">Home</a></li>
                    <li><a href="about.html">About</a></li>
                    <li><a href="services.html">Services </a></li>
                    <li><a href="room.html">Rooms</a></li>
                    <li><a href="contact.html">Contact</a></li>
                </ul>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
<!--footer end here-->
<!--copy rights start here-->
<div class="copy-right">
    <div class="container">
        <div class="copy-rights-main wow zoomIn" data-wow-delay="0.3s">
            <p>© 2016 Mr Hotel. All Rights Reserved | Design by <a href="http://w3layouts.com/" target="_blank">W3layouts</a>
            </p>
        </div>
    </div>
</div>
</body>
</html>